<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>我の日记</title>
    <!-- 引入 layui.css -->
    <link href="../jquery/layui-main/layui-main/src/css/layui.css" rel="stylesheet">
<!--    <link href="//unpkg.com/layui@2.9.13/dist/css/layui.css" rel="stylesheet">-->
    <!-- 引入 layui.js -->
    <!--<script src="../jquery/layui-main/layui-main/dist/layui.js"></script>-->
    <script src="//unpkg.com/layui@2.9.13/dist/layui.js"></script>

    <script src="diary.js"></script>
    <!--统一URL-->
    <script src="../URLJS/URL.js"></script>
    <script src="../jquery/jquery3.6.js"></script>


    <link rel="stylesheet" href="https://cdn.staticfile.org/layui/2.5.6/css/layui.css">
    <link rel="icon" href="/aaaa/favicon.ico">
</head>
<style>
    #bdy{
        background-color: red;
    }
    #txt{
        background: linear-gradient(to right, #7e2f2b,
        #146420)no-repeat right bottom;
        background-size: 0 2px;
        transition: background-size 0s;
    }
    #txt:hover{
        background-position: left bottom;
        background-size: 100% 2px ;
    }
    .layui-anim{animation-duration: 1.5s; -webkit-animation-duration: 1.5s;}
    .layui-anim{
        font-size: 300%;
        background: none;
    }
</style>
<body>
    <div id="bdy">
<div class="layui-anim" id="example-anim-element" style="padding: 16px 0;">
    <div class="layui-panel">
    <div style="padding: 32px;">
        <span id="txt">
            对你的第一印象是热烈像是夏日里一缕阳光 缓缓照进我的心底那些为你说出口的话现在终于写下来给你我喜欢你 喜欢你清澈明亮的眼睛喜欢你嘴角的盈盈笑意喜欢你奔跑起来的自由如风 喜欢你校服散发的淡淡香气喜欢你对待朋友的真诚 你是那么热烈的人让在你身边的人坏情绪都会被蒸发可小太阳偶尔也会被乌云困住我希望不好的事都远离你我真诚的希望你知道你那想留住的穿着校服的模样站在阳光下走廊操场的模样闪着光抖机灵话的模样已经在我心田里种下一枝永恒的玫瑰不会被雨淋湿不会被风吹走只会闪着露珠熠熠生辉青春是一片洋溢着梦想和热情的时光而你就像一缕微风 轻轻吹过我的生命带来了无尽的希望与光亮你是我青春里最后的风吹草动是那份青涩与激情的注解你让我明白生命中每一个瞬间都是宝贵的无论是短暂还是永恒 青春如诗你是其中最美的一页 愿你在未来的岁月中继续绽放光彩实现自己的梦想我们的故事或许只是短暂的插曲但它永远是我人生中最珍贵的一部分宝宝
</span></div>
</div>
</div>
<button class="layui-btn layui-btn-primary" id="example-anim-usage">下一舔</button>
    </div>
</body>
<script>
    layui.use(function(){
        var $ = layui.$;
        var elem = $('#example-anim-element');
        var animName = 'layui-anim-rotate'; // 动画类名

        // 通过事件简单演示动画过程
        $('#example-anim-usage').on('click', function(){
            elem.removeClass(animName);
            setTimeout(function(){
                elem.addClass(animName);
                initText();
            });
        });
    });
</script>
</html>
